<template>
  <!--下方查看详情表格面板-->
  <el-collapse-transition>
    <el-card v-if="showTable" class="new-queryResultDiv" :class="showSelectId ? 'min-Table' : 'max-Table'">
      <div class="new-queryTableBtn">
        <el-button @click="handleDelete" plain :disabled="multiple" v-if="typeName=='建筑物单体'||typeName=='建筑物公里格网'">删除</el-button>
        <el-button @click="closeTableDiv" plain>关闭</el-button>
        <span class="new-queryTableSpan">{{ selectType }}</span>
      </div>
      <div class="new-queryTableDiv">
        <!--数据表格-->
        <el-form ref="formTable" :model="tableDataForm" style="height:100%;">
          <el-table v-if="isTable" v-loading="loading" key="table1" ref="multipleTable" row-key="id" @selection-change="handleSelectionChange" :data="tableDataForm.tableData" tooltip-effect="dark"
            height="100%" :header-cell-style="{ textAlign: 'center' }"
            :cell-style="{ textAlign: 'center' }" stripe>
            <el-table-column type="selection" width="55" align="center" :reserve-selection="true" v-if="typeName=='建筑物公里格网'"/>
            <el-table-column v-for="item in tableDataForm.title" :key="item.prop" :prop="item.prop" :width="160" :label="item.label" />
            <el-table-column label="操作" fixed="right" width="120" v-if="typeName=='建筑物公里格网'">
              <template #default="scope">
                <el-button type="text" size="small" @click="handleDelete(scope.row)">删除</el-button>
              </template>
            </el-table-column>
          </el-table>
          <el-table v-if="isTable == false" v-loading="loading" ref="tableRef" height="100%" :data="tableDataForm.tableData" stripe
            row-key="id" @selection-change="handleSelectionChange" class="headborder-table">
            <!-- <el-table-column label="序号" type="index" width="80" align="center">
              <template #default="scope">
                <span>{{ (queryParams.page - 1) * queryParams.rows + scope.$index + 1 }}</span>
              </template>
            </el-table-column> -->
            <el-table-column type="selection" width="55" align="center" :reserve-selection="true" v-if="typeName=='建筑物单体'"/>
            <el-table-column label="建筑物编号" align="center" prop="buildingCode" width="100" />
            <el-table-column label="省" align="center" prop="province" width="120"/>
            <el-table-column label="市" align="center" prop="city" width="120"/>
            <el-table-column label="区/县" align="center" prop="county" width="120"/>
            <el-table-column label="经度" align="center" prop="longitude" width="120" />
            <el-table-column label="纬度" align="center" prop="latitude" width="120"/>
            <el-table-column label="结构类型" align="center" prop="" width="280">
              <el-table-column label="一级" align="center" prop="structureType1" width="140">
                <template #default="scope">
                  {{ getStructureType1(scope.row.structureType1) }}
                </template>
              </el-table-column>
              <el-table-column label="二级" align="center" prop="structureType2">
                <template #default="scope">
                  {{ getStructureType2(scope.row.structureType2) }}
                </template>
              </el-table-column>
            </el-table-column>
            <el-table-column label="设防情况" align="center" prop="defenceLevel" width="120">
              <template #default="scope">
                {{ getFortification(scope.row.defenceLevel) }}
              </template>
            </el-table-column>
            <el-table-column label="年代" align="center" prop="year" width="120">
              <template #default="scope">
                {{ getYearName(scope.row.year) }}
              </template>
            </el-table-column>
            <el-table-column label="层数" align="center" prop="floors" width="100">
              <template #default="scope">
                  {{ getUse1(scope.row.floors,floorOptions) }}
                </template>
            </el-table-column>
            <el-table-column label="房屋用途" align="center" prop="" width="280">
              <el-table-column label="一级" align="center" prop="usage1">
                <template #default="scope">
                  {{ getUse1(scope.row.usage1,useOption) }}
                </template>
              </el-table-column>
              <el-table-column label="二级" align="center" prop="usage2" width="140">
                <template #default="scope">
                  {{ getUse1(scope.row.usage2,fwAllArr) }}
                </template>
              </el-table-column>
            </el-table-column>
            <el-table-column label="建筑面积(平米)" align="center" prop="area" width="120"/>
            <el-table-column label="详细地址" align="center" prop="address" width="120"/>
            <el-table-column label="楼层号" align="center" prop="floorNum" />
            <el-table-column label="外墙厚度" align="center" prop="extWallThickness" />
            <el-table-column label="内墙厚度" align="center" prop="intWallThickness" />
            <el-table-column label="层宽" align="center" prop="floorWidth" />
            <el-table-column label="层长" align="center" prop="floorLength" />
            <el-table-column label="总楼层数" align="center" prop="totalFloors" />
            <el-table-column label="墙体截面积" align="center" prop="wallSectionArea" />
            <el-table-column label="场地类别" align="center" prop="landType" />
            <el-table-column label="建筑高度" align="center" prop="height" />
            <el-table-column label="层高" align="center" prop="floorHeight" />
            <el-table-column label="创建人" align="center" prop="createName" />
            <el-table-column label="操作" fixed="right" width="120" v-if="typeName=='建筑物单体'">
              <template #default="scope">
                <el-button type="text" size="small" @click="handleModify(scope.$index, scope.row)">修改</el-button>
                <el-button type="text" size="small" @click="handleDelete(scope.row)">删除</el-button>
              </template>
            </el-table-column>
          </el-table>
        </el-form>
      </div>
      <!--分页显示-->
      <div class="new-queryTableDiv-page">
        <el-pagination v-if="totalCount > 0" v-model:current-page="currentPage" background
          v-model:page-size="pageSize" layout="total, sizes, prev, pager, next, jumper" :total="totalCount"
          @current-change="handleCurrentChange" @size-change="handleSizeChange" />
      </div>
    </el-card>
  </el-collapse-transition>


  <!--操作数据 -->
  <el-dialog v-model="open" v-if="open" append-to-body title="修改建筑物单体数据" width="800px">
    <p class="mt15"></p>
    <el-form ref="ruleForm" :model="form" :rules="rules" label-width="130px">
      <el-row>
        <el-col :span="12">
					<el-form-item label="一级结构类型" prop="structureType1">
							<el-select v-model="form.structureType1" placeholder="请选择" @change="structureType1Change" clearable style="width:100%">
								<el-option v-for="item in structureTypeArr1" :key="item.dictItemCode"
									:label="item.dictItemName" :value="item.dictItemCode">
								</el-option>
							</el-select>
					</el-form-item>
				</el-col>
        <el-col :span="12">
          <el-form-item label="二级结构类型" prop="structureType2">
						<el-select v-model="form.structureType2" placeholder="请选择" clearable style="width:100%">
							<el-option v-for="item in structureTypeArr2" :key="item.dictItemCode"
								:label="item.dictItemName" :value="item.dictItemCode">
							</el-option>
						</el-select>
					</el-form-item>
        </el-col>
        <el-col :span="12">
						<el-form-item label="年代" prop="year">
							<el-select v-model="form.year" placeholder="请选择" style="width:100%">
								<el-option v-for="item in yearOption" :key="item.dictItemCode" :label="item.dictItemName"
									:value="item.dictItemCode">
								</el-option>
							</el-select>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="设防情况" prop="defenceLevel">
							<el-select v-model="form.defenceLevel" placeholder="请选择" style="width:100%">
								<el-option v-for="item in fortificationOptions" :key="item.dictItemCode" :label="item.dictItemName"
									:value="item.dictItemCode">
								</el-option>
							</el-select>
						</el-form-item>
					</el-col>
          <el-col :span="12">
					<el-form-item label="一级房屋用途" prop="usage1">
							<el-select v-model="form.usage1" placeholder="请选择" @change="use1Change" clearable style="width:100%">
								<el-option v-for="item in useOptions" :key="item.dictItemCode"
									:label="item.dictItemName" :value="item.dictItemCode">
								</el-option>
							</el-select>
					</el-form-item>
				</el-col>
        <el-col :span="12">
          <el-form-item label="二级房屋用途" prop="usage2">
						<el-select v-model="form.usage2" placeholder="请选择" clearable style="width:100%">
							<el-option v-for="item in useOptions1" :key="item.dictItemCode"
								:label="item.dictItemName" :value="item.dictItemCode">
							</el-option>
						</el-select>
					</el-form-item>
        </el-col>
        <el-col :span="12">
					<el-form-item label="层数" prop="floors">
						<el-select v-model="form.floors" placeholder="请选择" style="width:100%" :idsabled=disabledcs>
							<el-option v-for="item in csOptions" :key="item.dictItemCode" :label="item.dictItemName"
								:value="item.dictItemCode">
							</el-option>
						</el-select>
					</el-form-item>
				</el-col>
        <el-col :span="12">
					<el-form-item label="建筑面积(平米)" prop="area">
						<el-input v-model="form.area" placeholder="请输入" clearable />
					</el-form-item>
				</el-col>
        <el-col :span="12">
					<el-form-item label="详细地址" prop="address">
						<el-input v-model="form.address" placeholder="请输入" clearable />
					</el-form-item>
				</el-col>
        <el-col :span="12">
					<el-form-item label="楼层号" prop="floorNum">
						<el-input v-model="form.floorNum" placeholder="请输入" clearable />
					</el-form-item>
				</el-col>
        <el-col :span="12">
					<el-form-item label="外墙厚度" prop="extWallThickness">
						<el-input v-model="form.extWallThickness" placeholder="请输入" clearable />
					</el-form-item>
				</el-col>
        <el-col :span="12">
					<el-form-item label="内墙厚度" prop="intWallThickness">
						<el-input v-model="form.intWallThickness" placeholder="请输入" clearable />
					</el-form-item>
				</el-col>
        <el-col :span="12">
					<el-form-item label="层宽" prop="floorWidth">
						<el-input v-model="form.floorWidth" placeholder="请输入" clearable />
					</el-form-item>
				</el-col>
        <el-col :span="12">
					<el-form-item label="层长" prop="floorLength">
						<el-input v-model="form.floorLength" placeholder="请输入" clearable />
					</el-form-item>
				</el-col>
        <el-col :span="12">
					<el-form-item label="总楼层数" prop="totalFloors">
            <el-input-number v-model="form.totalFloors" :min="1" controls-position="right" placeholder="请输入" style="width:100%"/>
					</el-form-item>
				</el-col>
        <el-col :span="12">
					<el-form-item label="墙体截面积" prop="wallSectionArea">
            <el-input-number v-model="form.wallSectionArea" :min="0" controls-position="right" placeholder="请输入" style="width:100%"/>
					</el-form-item>
				</el-col>
        <el-col :span="12">
					<el-form-item label="场地类别" prop="landType">
            <el-input v-model="form.landType" placeholder="请输入" clearable />
            <!-- <el-select v-model="form.landType" placeholder="请选择" clearable style="width:100%">
							<el-option v-for="item in structureTypeArr2" :key="item.dictItemCode"
								:label="item.dictItemName" :value="item.dictItemCode">
							</el-option>
						</el-select> -->
					</el-form-item>
				</el-col>
        <el-col :span="12">
					<el-form-item label="建筑物高" prop="height">
						<el-input v-model="form.height" placeholder="请输入" />
					</el-form-item>
				</el-col>
        <el-col :span="12">
					<el-form-item label="层高" prop="floorHeight">
						<el-input v-model="form.floorHeight" placeholder="请输入" />
					</el-form-item>
				</el-col>
			</el-row>
    </el-form>
    <template #footer>
        <div class="dialog-footer">
            <el-button type="primary" @click="submitForm">保存</el-button>
            <el-button @click="open = false">取消</el-button>
        </div>
    </template>
  </el-dialog>
</template>

<script setup>
import { queryDataView,delkilometerGrid } from '@/api/basicDataManage/kilometerGrid/index.js'
import { queryDataViewRk } from '@/api/basicDataManage/population.js'
import { queryDataViewJj } from '@/api/basicDataManage/economics.js'
import { queryDataViewCyGl } from '@/api/basicDataManage/beyondProbability.js'
import { listData, updateSingle, getDetail, delSingle, getRole } from '@/api/basicDataManage/singleBuilding'
import { getDict } from "@/api/system/dict"
import { computed, reactive, toRefs } from "vue";
import { ElMessage, ElMessageBox } from 'element-plus';
import { debug } from 'util'

const props = defineProps({
  versionCode: {
    type: String,
    default: ''
  },
  typeCode: {
    type: String,
    default: ''
  },
  showTable: {
    type: Boolean,
    default: false
  },
  typeName: {
    type: String,
    default: ''
  },
  paramsData: {
    type: Object,
    default: {}
  },
  defenceLevelArr:{
    type: Array,
    default: []
  },
  usageArr1:{
    type: Array,
    default: []
  },
  selectListId: {
    type: String,
    default: ''
  },
});

const { proxy } = getCurrentInstance();
const loading = ref(false);
const currentPage = ref(1);//当前页码
const pageSize = ref(10);//每页显示数据数量
const totalCount = ref(0);//总数据数量
const selectType = ref('')
const showSelectId = ref(false)
const isTable = ref(true)
const structureTypeArr1 = ref([])
const structureTypeArr2All = ref([])
const yearArr = ref([])
const rules = ref({
    structureType1: [{ required: true, message: "一级结构不能为空", trigger: "change" }],
    defenceLevel: [{ required: true, message: "设防情况不能为空", trigger: "change" }],
    usage1: [{ required: true, message: "一级房屋用途不能为空", trigger: "change" }],
    area: [{ required: true, message: "建筑面积不能为空", trigger: "blur" }],
  })

const data = reactive({
  tableDataForm: {
    tableData: [],//表格数据
    //通用字段
    title: []
  },
  params: {
    page: 1,
    rows: 10
  },
});
const { tableDataForm,params } = toRefs(data);

//查询
watch(() => props.showTable, val => {
  if (val) {
    showSelectId.value = true;
    params.value.versionCode = props.versionCode;
    params.value.typeCode = props.typeCode;
    //查询数据
    queryTableDataByPage();
  }
}, { deep: true, immediate: true });

const emits = defineEmits(['closeTableDiv']);
//关闭
const closeTableDiv = () => {
  emits("closeTableDiv");
}

//分页
const handleSizeChange = (val) => {
  // 改变每页显示的条数
  pageSize.value = val;
  // 注意：在改变每页显示的条数时，要将页码显示到第一页
  currentPage.value = 1;
  queryTableDataByPage();
};
const handleCurrentChange = (val) => {
  currentPage.value = val;
  queryTableDataByPage();
};

//分页查询数据
function queryTableDataByPage() {
  showSelectId.value = false;
  params.value.page = currentPage.value;
  params.value.rows = pageSize.value;
  //数据查询
  loading.value = true;
  if(props.typeName == '建筑物公里格网') {
    selectJzw()
  }else if(props.typeName == '人口') {
    selectRk()
  }else if(props.typeName == '经济') {
    selectJj()
  }else if(props.typeName == '超越概率') {
    selectCyGl()
  }else if(props.typeName == '建筑物单体') {
    // selectJzwdt()
    getDictData()
    getDictData2()
    getDictData3()
    if(props.selectListId!==""){
      showSelectId.value = true;
      selectJzwdtById(props.selectListId)
    }else{
      selectJzwdt()
    }
  }
}
function selectJzw() {
  isTable.value = true
  //分页查询
  queryDataView(params.value).then((response) => {
    nextTick(() => {
      tableDataForm.value.title = response.data.title;
      if (response.data.data && response.data.data.length > 0) {
        tableDataForm.value.tableData = response.data.data;
      } else {
        tableDataForm.value.tableData = [];
      }
      totalCount.value = response.data.total;
      loading.value = false;
    });
  }).catch(err => {
    totalCount.value = 0;
    tableDataForm.value.tableData = [];
    tableDataForm.value.title = [];//清空多选
    loading.value = false;
  });
}
function selectRk() {
  isTable.value = true
  //分页查询
  queryDataViewRk(params.value).then((response) => {
    nextTick(() => {
      tableDataForm.value.title = response.data.title;
      if (response.data.data && response.data.data.length > 0) {
        tableDataForm.value.tableData = response.data.data;
      } else {
        tableDataForm.value.tableData = [];
      }
      totalCount.value = response.data.total;
      loading.value = false;
    });
  }).catch(err => {
    totalCount.value = 0;
    tableDataForm.value.tableData = [];
    tableDataForm.value.title = [];//清空多选
    loading.value = false;
  });
}
function selectJj() {
  isTable.value = true
  //分页查询
  queryDataViewJj(params.value).then((response) => {
    nextTick(() => {
      tableDataForm.value.title = response.data.title;
      if (response.data.data && response.data.data.length > 0) {
        tableDataForm.value.tableData = response.data.data;
      } else {
        tableDataForm.value.tableData = [];
      }
      totalCount.value = response.data.total;
      loading.value = false;
    });
  }).catch(err => {
    totalCount.value = 0;
    tableDataForm.value.tableData = [];
    tableDataForm.value.title = [];//清空多选
    loading.value = false;
  });
}
function selectCyGl() {
  isTable.value = true
  //分页查询
  queryDataViewCyGl(params.value).then((response) => {
    nextTick(() => {
      tableDataForm.value.title = response.data.title;
      if (response.data.data && response.data.data.length > 0) {
        tableDataForm.value.tableData = response.data.data;
      } else {
        tableDataForm.value.tableData = [];
      }
      totalCount.value = response.data.total;
      loading.value = false;
    });
  }).catch(err => {
    totalCount.value = 0;
    tableDataForm.value.tableData = [];
    tableDataForm.value.title = [];//清空多选
    loading.value = false;
  });
}
function selectJzwdt() {
  isTable.value = false
  let param = {
    province: props.paramsData.province,
    city: props.paramsData.city,
    county: props.paramsData.county,
    defenceLevel: props.paramsData.defenceLevel,
    structureType1: props.paramsData.structureType1,
    structureType2: props.paramsData.structureType2,
    versionCode:props.paramsData.versionCode,
    page: params.value.page,
    rows: params.value.rows,
  }
  //分页查询
  listData(param).then((response) => {
    nextTick(() => {
      if (response.data.rows && response.data.rows.length > 0) {
        tableDataForm.value.tableData = response.data.rows;
      } else {
        tableDataForm.value.tableData = [];
      }
      totalCount.value = response.data.total;
      loading.value = false;
    });
  }).catch(err => {
    totalCount.value = 0;
    tableDataForm.value.tableData = [];
    tableDataForm.value.title = [];//清空多选
    loading.value = false;
  });
}

//修改
let open = ref(false);
let form = ref({})
let structureTypeArr2 = ref([])
let yearOption = ref([])
let csOptions = ref([])
let fortificationOptions = computed(()=>props.defenceLevelArr)
let useOption = ref([
            {
                dictItemName: '第Ⅰ类',
                dictItemCode: '1',
                children: [
                    {
                        dictItemName: '住宅',
                        dictItemCode: 'y1'
                    },
                    {
                        dictItemName: '公寓',
                        dictItemCode: 'y2'
                    },
                    {
                        dictItemName: '学生和职工集体宿舍',
                        dictItemCode: 'y3'
                    },
                    {
                        dictItemName: '宾馆',
                        dictItemCode: 'y4'
                    },
                    {
                        dictItemName: '招待所',
                        dictItemCode: 'y5'
                    },
                    {
                        dictItemName: '其他人员居住场所',
                        dictItemCode: 'y6'
                    }
                ]
            },
            {
                dictItemName: '第Ⅱ类',
                dictItemCode: '2',
                children: [
                    {
                        dictItemName: '办公室',
                        dictItemCode: 'e1'
                    },
                    {
                        dictItemName: '生产车间',
                        dictItemCode: 'e2'
                    },
                    {
                        dictItemName: '教室',
                        dictItemCode: 'e3'
                    },
                    {
                        dictItemName: '其他工作与学习场所',
                        dictItemCode: 'e4'
                    }
                ]
            },
            {
                dictItemName: '第Ⅲ类',
                dictItemCode: '3',
                children: [
                    {
                        dictItemName: '除I、II类以外',
                        dictItemCode: '1'
                    }
                ]
            }
        ])
let useOptions = ref([]);
let useOptions1 = ref([]);
let disabledcs = ref(false); //控制层数开关
let landTypeOption = ref([]); // 场地类别
const multiple = ref(true);
const ids = ref();
// 多选框选中数据
function handleSelectionChange(selection) {
    ids.value = selection.map(item => item.id);
    multiple.value = !selection.length;
}

function selectJzwdtById(id) {
  isTable.value = false
  //分页查询
  getDetail(id).then((response) => {
    nextTick(() => {
      if (response.data) {
        tableDataForm.value.tableData = [response.data];
      } else {
        tableDataForm.value.tableData = [];
      }
      totalCount.value = 1;
      loading.value = false;
    });
  }).catch(err => {
    totalCount.value = 0;
    tableDataForm.value.tableData = [];
    tableDataForm.value.title = [];//清空多选
    loading.value = false;
  });
}
function getYearName(val) {
	var name = ''
	yearArr.value.forEach(item => {
		if (item.dictItemCode == val) {
			name = item.dictItemName
			return
		}
	})
	return name
}
function getUsage1Name(val) {
  var name = ''
  usageArr.value.forEach(item => {
    if (item.dictItemCode == val) {
      name = item.dictItemName
      return
    }
  })
  return name
}
function getUsage2Name(val) {
  var name = ''
  usage1Arr.value.forEach(item => {
    if (item.dictItemCode == val) {
      name = item.dictItemName
      return
    }
  })
  usage2Arr.value.forEach(item => {
    if (item.dictItemCode == val) {
      name = item.dictItemName
      return
    }
  })
  return name
}
function getStructureType1(val1) {
	var name = ''
	structureTypeArr1.value.forEach(item => {
		if (item.dictItemCode == val1) {
			name = item.dictItemName
			return
		}
	})
	return name
}
function getStructureType2(val2) {
	var name = ''
	structureTypeArr2All.value.forEach(item => {
		if (item.dictItemCode == val2) {
			name = item.dictItemName
			return
		}
	})
	return name
}
function getUse1(val1,arr) {
	var name = ''
	arr.forEach(item => {
		if (item.dictItemCode == val1) {
			name = item.dictItemName
			return
		}
	})
	return name
}
function getFortification(val){
  var name = ''
	props.defenceLevelArr.forEach(item => {
		if (item.dictItemCode == val) {
			name = item.dictItemName
			return
		}
	})
	return name
}
async function getDictData() {
	await getDict("jglxyj").then(response => {
		structureTypeArr1.value = response.data;
	});
  await getDict("year").then(response => {
		yearArr.value = response.data;
    yearOption.value = response.data
	});
}
const structureTypeArr21 = ref([])
const structureTypeArr22 = ref([])
const structureTypeArr26 = ref([])
async function getDictData2() {
	await getDict("qtjgej").then(response => {
		structureTypeArr21.value = response.data;
	});

	await getDict("gjhntjgej").then(response => {
		structureTypeArr22.value = response.data;
	});

	await getDict("gycfej").then(response => {
		structureTypeArr26.value = response.data;
	});

  await getDict("cdlb").then(response => {
		landTypeOption.value = response.data;
	});
	structureTypeArr2All.value = [...structureTypeArr21.value, ...structureTypeArr22.value, ...structureTypeArr26.value]
}
const fwyjArr = ref([])
const fwejArr = ref([])
const fwsjArr = ref([])
const fwAllArr = ref([])
const floorOptions = ref([])
async function getDictData3() {
	await getDict("dylej").then(response => {
		fwyjArr.value = response.data;
	});

	await getDict("delej").then(response => {
		fwejArr.value = response.data;
	});

	await getDict("fwytsan").then(response => {
		fwsjArr.value = response.data;
	});
  await getDict("cengshu").then(response =>{
    floorOptions.value = response.data;
    csOptions.value = response.data;
  })
	fwAllArr.value = [...fwyjArr.value, ...fwejArr.value, ...fwsjArr.value]
}

const handleModify = (index, row) => {
  open.value = true;
  if(row.structureType1){
    structureType1Change(row.structureType1)
  }
  if(row.usage1){
    use1Change(row.usage1)
  }
  form.value = {...row};
}

// 改变一级结构类型
const structureType1Change = (value) =>{
  if(!value||value==''){
    form.value.structureType2 = '';
    structureTypeArr2.value = [];
    return;
  }
  type2(value);
  // 清空年代
  form.value.year = '';
  yearOption.value = yearArr.value;
  // 清空设防情况
  form.value.defenceLevel = '';
  fortificationOptions.value = props.defenceLevelArr
  // 清空用途
  form.value.usage1 = '';
  form.value.usage2 = '';
  // 清空层数
  form.value.floors = '';
  let val = getStructureType1(value)
  if(val=='钢筋混凝土结构'||val == '钢结构'){
    csOptions.value = floorOptions.value;
    disabledcs.value = false;
    useOptions.value = useOption.value
  }else if(val == '组合结构'){
    csOptions.value = floorOptions.value.filter((item,index)=>index==2)
    form.value.floors = ''
    disabledcs.value = false;
    // 用途处理
		useOptions.value = [
            {
                dictItemName: '第Ⅰ类',
                dictItemCode: '1',
                children: [
                    {
                        dictItemName: '住宅',
                        dictItemCode: 'y1'
                    },
                    {
                        dictItemName: '公寓',
                        dictItemCode: 'y2'
                    },
                    {
                        dictItemName: '学生和职工集体宿舍',
                        dictItemCode: 'y3'
                    },
                    {
                        dictItemName: '宾馆',
                        dictItemCode: 'y4'
                    },
                    {
                        dictItemName: '招待所',
                        dictItemCode: 'y5'
                    },
                    {
                        dictItemName: '其他人员居住场所',
                        dictItemCode: 'y6'
                    }
                ]
            },
            {
                dictItemName: '第Ⅱ类',
                dictItemCode: '2',
                children: [
                    {
                        dictItemName: '办公室',
                        dictItemCode: 'e1'
                    },
                ]
            },
        ]
    // 设防情况
    fortificationOptions.value = props.defenceLevelArr.filter(item=>(item.dictItemName!='未设防'&&item.dictItemName!='自设防'));
  }else if(val=='砌体结构'){
    // 层数处理
		csOptions.value = floorOptions.value.filter((item, index) => index < 2);
    disabledcs.value = false;
    // 切换类型时，部分类型楼层没有就"9层以上"选项，则清空
		if (form.value.floors == '9层以上') {
			form.value.floors = ''
		}
    // 设防情况
		fortificationOptions.value = props.defenceLevelArr;
  }else{
    // 层数处理
		disabledcs.value = true;
		csOptions.value = [];
		form.value.floors = ''
    	// 用途
		if(val=='土木结构'||val=='木结构'||val=='其他'){
		useOptions.value = [
          {
              dictItemName: '第Ⅰ类',
              dictItemCode: '1',
              children: [
                  {
                      dictItemName: '住宅',
                      dictItemCode: 'y1'
                  },
                  {
                      dictItemName: '其他人员居住场所',
                      dictItemCode: 'y6'
                  }
              ]
          },
          {
              dictItemName: '第Ⅲ类',
              dictItemCode: '3',
              children: [
                  {
                      dictItemName: '除I、II类以外',
                      dictItemCode: '1'
                  }
              ]
          }
      ]
      if(val=='土木结构'){
		// 设防情况
		fortificationOptions.value = props.defenceLevelArr.filter(item=>item.dictItemName=='未设防');
		yearOption.value = yearArr.value.filter((item, index) => index < 4);
		// 切换类型时，年代--选项，则清空
		if (form.value.year == '5'||form.value.year == '6') {
			form.value.year = ''
		}
		}else if(val=='其他'){
			fortificationOptions.value = props.defenceLevelArr.filter(item=>(item.dictItemName =='未设防'||item.dictItemName =='自设防'||item.dictItemName =='6度'));
		}
    }else{
			useOptions.value = [
            {
                dictItemName: '第Ⅱ类',
                dictItemCode: '2',
                children: [
                    {
                        dictItemName: '生产车间',
                        dictItemCode: 'e2'
                    },
                ]
            },
        ]
		}
  }
}

const use1Change = (val) => {
  const use = useOptions.value.find((item) => item.dictItemCode == val);
	if (use) {
		useOptions1.value = use.children;
	}
	// 清空选中的二级候选值
	form.value.usage2 = '';
}
const type2 = (code) =>{
  let codeNum = '';
  form.value.structureType2 = ''
  structureTypeArr2.value = [];
  if(code=='1'){
    codeNum = 'qtjgej'
  }else if(code=='2'){
    codeNum = 'gjhntjgej'
  }else if(code=='6'){
    codeNum = 'gycfej'
  }
  if(codeNum=='')return;
  getDict(codeNum).then(res=>{
    structureTypeArr2.value = res.data
  })
}

// 修改保存
const submitForm = () =>{
  proxy.$refs["ruleForm"].validate(valid => {
    if (valid) {
      updateSingle({...form.value}).then(res=>{
        queryTableDataByPage();
        proxy.$modal.msgSuccess("修改成功");
        open.value = false;
      })
    }
  })  
}

//删除
function handleDelete(row) {
    const id = row.id || ids.value.join(',');
    proxy.$modal.confirm('是否确认删除数据项？').then(function () {
      if(props.typeName=='建筑物单体'){
        return delSingle(id);
      }else if(props.typeName=='建筑物公里格网'){
        return delkilometerGrid({id:id,typeCode:props.typeCode});
      }
    }).then(() => {
        queryTableDataByPage();
        proxy.$modal.msgSuccess("删除成功");
        proxy.$refs['tableRef']?.clearSelection();
        proxy.$refs['multipleTable']?.clearSelection();
    }).catch(() => { });
}

</script>

<style lang="scss" scoped>
.min-Table {
  height: 250px;
}

.max-Table {
  height: 75%;
}

//下方查看详情面板
.new-queryResultDiv {
  position: absolute;
  left: 0px;
  right: 0px;
  bottom: 0px;
  z-index: 10;
}

.new-queryTableBtn {
  // margin: 10px 0;
  position: absolute;
  left: 0px;
  right: 0px;
  top: 0px;
  height: 50px;
  padding: 10px;
}

.new-queryTableSpan {
  position: relative;
  top: -32px;
  width: 100%;
  text-align: center;
  font-weight: bold;
  font-size: 18px;
  color: var(--el-color-primary);
  display: inline-block;
  line-height: 32px;
  z-index: -1;
}

.new-queryTableDiv {
  position: absolute;
  left: 10px;
  right: 10px;
  top: 50px;
  bottom: 50px;
}

.new-queryTableDiv-page {
  position: absolute;
  // left: 10px;
  right: 10px;
  bottom: 0px;
  height: 50px;
  padding: 8px;
}

:deep(.el-form-item--default) {
  padding-top: 20px;
}

/*多级表头的边框*/
:deep(.el-table thead.is-group th.el-table__cell) {
  border-bottom: 1px solid #CCCCCC;
  border-right: 1px solid #CCCCCC;
}
</style>